{% extends "dash/base_dash.html" %}

{% block mystylesheet %}
    <link rel="stylesheet" href="/mymedia/css/styleMati.css" type="text/css" />
    <link rel="stylesheet" href="/mymedia/css/style-icon-images.css" type="text/css" />
{% endblock mystylesheet%}

{% block menuOptionsSelected %}
    <ul class="menu-options">
        <li class="menu-item"><a href="/dash/dashboard/">Dashboard</a></li>
        <li class="menu-item-selected"><a href="/dash/logbook/">Logbook</a></li>
        <li class="menu-item"><a href="/dash/topicos/">Topicos</a></li>
    </ul>
{% endblock menuOptionsSelected %}


{% block dashboard %}
    <h1>Actividad de los usuarios que tu sigues</h1>
    <div class="logbook-content-list">
        {% if actividades %}
            {% for actividad in actividades %}
                {% if actividad.tipo == "fan" %}
                    <div class="actividad-fan-content">
                        <div class="actividad-user-orig">
                            <div class="actividad-imagen"><img src="{{ actividad.usuario_origen.persona.avatar.url_50x50 }}"/></div>

                        </div>
                        <div class="actividad-desc-content">
                            <div class="actividad-imagen">{{ actividad.usuario_origen.first_name }}</div>
                            <div class="actividad-desc">{{ actividad.descripcion }}</div>
                            <div class="actividad-item" >{{ actividad.item}}</div>
                            <div class="actividad-fecha">{{ actividad.fecha }}</div>

                        </div>
                    </div>
                {% endif %}

                {% if actividad.tipo == "comentario" %}
                    <div class="actividad-fan-content">
                        <div class="actividad-user-orig">
                            <div class="actividad-imagen"><img src="{{ actividad.usuario_origen.persona.avatar.url_50x50 }}"/></div>

                        </div>
                        <div class="actividad-desc-content">
                            <div class="actividad-imagen">{{ actividad.usuario_origen.first_name }}</div>
                            <div class="actividad-desc">{{ actividad.descripcion }}</div>
                            <div class="actividad-item" >{{ actividad.item}}</div>
                            <div class="" >"{{ actividad.comentario.comentario }}"</div>
                            <div class="actividad-fecha">{{ actividad.fecha }}</div>

                        </div>
                    </div>
                {% endif %}

                {% if actividad.tipo == "recomendacion" %}
                    <div class="actividad-fan-content">
                        <div class="actividad-user-orig">
                            <div class="actividad-imagen"><img src="{{ actividad.usuario_origen.persona.avatar.url_50x50 }}"/></div>

                        </div>
                        <div class="actividad-desc-content">
                            <div class="actividad-imagen">{{ actividad.usuario_origen.first_name }}</div>
                            <div class="actividad-desc">{{ actividad.descripcion }}</div>
                            <div class="actividad-item" >{{ actividad.item}}</div>
                            <div class="actividad-fecha">{{ actividad.fecha }}</div>
                        </div>
                    </div>
                {% endif %}
            {% endfor %}
        {% else %}
            No hay nada
        {% endif %}
    </div>
{% endblock dashboard %}

{% block sidebar %}
    <div class="sidebar-content">
            <div class="sidebar-user">
                <div class="user-name">{{ user.first_name }} {{ user.last_name }}</div>
                <div class="user-stars">
                    <ul>
                        <li class="user-star"><img src="/mymedia/images/item-ratings.png" alt="Star" /></li>
                        <li class="user-star"><img src="/mymedia/images/item-ratings.png" alt="Star" /></li>
                        <li class="user-star"><img src="/mymedia/images/item-ratings.png" alt="Star" /></li>
                        <li class="user-star"><img src="/mymedia/images/item-ratings.png" alt="Star" /></li>
                        <li class="user-star"><img src="/mymedia/images/item-ratings.png" alt="Star" /></li>
                        <li class="user-star"><img src="/mymedia/images/item-ratings.png" alt="Star" /></li>
                    </ul>
                </div>
            </div>
            <div class="sidebar-stadistic">
                <a href="/dash/fans/">
                    <div class="stadistic-fan sidebar-stadistic-item" title="Podés consultar de que items sos Fan">
                        <div class="stadistic-num">{{ user.persona.items.count }}</div>
                        <div class="stadistic-nom">Fan{% if user.persona.items.count > 1 %}s{% endif %}</div>
                    </div>
                </a>
                <a href="/dash/following/">
                    <div class="stadistic-recomendations sidebar-stadistic-item">
                        <div class="stadistic-num">{{ user.persona.following.count }}</div>
                        <div class="stadistic-nom">
                            {% if user.persona.following.count > 1 %}
                                Usuarios sigo
                            {% else %}
                                Usuario sigo
                            {% endif %}
                        </div>
                    </div>
                </a>
                <a href="/dash/followers/">
                    <div class="stadistic-comments sidebar-stadistic-item">
                        <div class="stadistic-num">{{ user.followers.count }}</div>
                        <div class="stadistic-nom">
                            {% if user.followers.count > 1 %}
                                Usuarios me siguen
                            {% else %}
                                Usuario me sigue
                            {% endif %}
                        </div>
                    </div>
                </a>
            </div>
            <div class="sidebar-menu-indicators">
                <a href="/social/messages/">
                    <div class="menu-indicators" title="Revisá tus mensajes recibidos y enviados"><div class="mini-img-msg"></div>Mensajes
                        {% if mensajes_nolidas > 0 %}({{ mensajes_nolidas }}){% endif %}
                    </div>
                </a>
                <a href="/social/eventos/">

                    <div class="menu-indicators" title="Revisá los eventos que creaste y a los cuales estas invitado"><div class="mini-img-event"></div>Eventos
                        {% if eventos_nolidas > 0 %}({{ eventos_nolidas }}){% endif %}
                    </div>
                </a>
                <a href="/social/user_main_notification/">
                    <div class="menu-indicators" title="Revisá cuales son tus notificaciones de parte de tus productos favoritas"><div class="mini-img-notify"></div>Notificaciones
                        {% if notificaciones_nolidas > 0 %}({{ notificaciones_nolidas }}){% endif %}
                    </div>
                </a>
                <a href="/dash/recomendation/">
                    <div class="menu-indicators" title="Revisá las recomendaciones que te hicieron los usuarios que seguís"><div class="mini-img-recom"></div>Recomendaciones
                        {% if recomendaciones_noleidas > 0 %}({{ recomendaciones_noleidas }}){% endif %}
                    </div>
                </a>
            </div>
            </div>
            <div class="sidebar-new-item">
                <a href="/items/item/register/"><div class="new-item-buttom">Crear Item</div></a>
            </div>
            <div class="clear"></div>
        </div>
{% endblock sidebar %}
